import Vue from 'vue'
import Router from 'vue-router'
const Home = resolve => require(['@/components/'], resolve);

const JsHtml5 = resolve => require(['@/components/technology/'], resolve);

const Article = resolve => require(['@/components/article/'], resolve);

const lifeTime = resolve => require(['@/components/liftTime/'], resolve);
// const TechnologyList = resolve => require(['@/components/technology/main'], resolve);
const JSExample = resolve => require(['@/components/JSExample/'], resolve);
const JSBooks = resolve => require(['@/components/JSBooks/'], resolve);
const Details = resolve => require(['@/components/common/details'], resolve);
const ErrorHtml = resolve => require(['@/components/ErrorHtml/'], resolve);
Vue.use(Router)

const router = new Router({
    // mode:'history',
    routes: [{
            path: '/',
            // name: 'home',
            component: Home,
            redirect: '/home',
            children: [{
                path: '/home',
                name: 'home',
                component: Home,
            }]
        },
        {
            path: '/technology',
            name: 'technology',
            component: JsHtml5,
            redirect: {
                name: 'technologyList',
            },
            children: [{
                path: 'technologyList',
                name: 'technologyList',
                component: Home,
                props: { name: 'technology' }
            }, {
                path: 'details',
                name: 'technologyDetails',
                component: Details,
            }]
        },
        {
            path: '/error',
            name: 'error',
            component: ErrorHtml
        },
        {
            path: '/article',
            name: 'article',
            component: Article,
            redirect: {
                name: 'articleList',
            },
            children: [{
                path: 'articleList',
                name: 'articleList',
                component: Home,
                props: { name: 'article' }
            }, {
                path: 'details',
                name: 'articleDetails',
                component: Details,
            }]
        },
        {
            path: '/jsBook',
            name: 'jsBook',
            component: JSBooks,
        },
        {
            path: '/lifeTime',
            name: 'lifeTime',
            component: lifeTime,
            redirect: {
                name: 'lifeTimeList',
            },
            children: [{
                path: 'lifeTimeList',
                name: 'lifeTimeList',
                component: Home,
                props: { name: 'lifeTime' }
            }, {
                path: 'details',
                name: 'lifeTimeDetails',
                component: Details,
            }]
        },
        {
            path: '/jsExample',
            name: 'jsExample',
            component: JSExample,
        }
    ]
})

// 路由跳转前验证
router.beforeEach((to, from, next) => {
    if (to.matched.length === 0) { //如果未匹配到路由
        //如果上级也未匹配到路由则跳转登录页面，如果上级能匹配到则转上级路由
        // if (navigator.userAgent.indexOf('compatible') != -1 &&
        //     navigator.userAgent.indexOf('MSIE') != -1 &&
        //     navigator.userAgent.indexOf('Opera') == -1) {
        //     alert('IE');
        //     return;
        // }
        next({ name: 'error' });

    } else {
        next();
    }
});

export default router